import React, { Component } from 'react';
import TabControl from './TabControl';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      titles: ['流行', '新款', '精选'],
      tabIndex: 0
    }
  }
  tabChange(index) {
    this.setState({
      tabIndex: index
    })
  }

  render() { 
    const {titles, tabIndex} = this.state;
    return ( 
      <div>
        <TabControl titles = {titles} tabChange={(index) => this.tabChange(index)}></TabControl>
        <h1>{titles[tabIndex]}</h1>
      </div>
     );
  }
}
 
export default App;